import Vue from 'vue';
import JoinModule from './Join.vue';

/*vue文件为单独弹出的模块,js控制弹出隐藏状态以及初始状态*/
var JoinTemplate = Vue.extend({
    template: '<div><join-module V-bind:show.sync="ModuleShow" V-bind:id.sync="id" ></join-module></div>',
    components: {
        JoinModule
    }
})

var Join = new JoinTemplate({
    data: function () {
        return {
            ModuleShow: false,
            id:''
        }
    },
    methods: {
        show(id) {
            this.ModuleShow = true
            this.id = id
        },
        hidden() {
            this.ModuleShow = false
        }
    }
})

/*仅挂载一次*/
Join.$once('mount', function (target) {
    if (!document.getElementById('Join')){
        let div = document.createElement('div');
        div.setAttribute('id', 'Join');
        document.body.appendChild(div);
    }
    target.$mount('#Join');
})


export default module = function(){
    this.Join = Join;
}
module.show = function show(id) {
    Join.$emit('mount', Join);
    Join.show(id);
}
module.hidden = function hidden() {
    Join.hidden();
}

